<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
<meta content="yes" name="apple-mobile-web-app-capable">
<meta content="black" name="apple-mobile-web-app-status-bar-style">
<meta content="telephone=no" name="format-detection">
<meta content="email=no" name="format-detection">
<title>demo</title>
<link rel="stylesheet" href="css/index.css" />

</head>

<body>
<div class="charector-wrap " id="js_wrap">
	<div class="charector"></div>
</div>

<a class="run-xfast" href="#none">最快</a>
<a class="run-fast" href="#none">快</a>
<a class="run-normal" href="#none">正常</a>
<a class="run-slow" href="#none">慢</a>
<button class="btn-paused">暂停</button>
</body>
</html>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
	$(document).ready(function(){	
		$("a").on("click",function(e){
			$("#js_wrap").find(".charector-wrap").removeClass("paused");
			$("#js_wrap").attr("class","charector-wrap " + $(e.target).attr("class").split("-")[1])
		})
		$(".btn-paused").click(function(){
			$("#js_wrap").addClass("paused");
		})
	})

</script>











